415. Araxis Merge File Comparison Report

Produced by Araxis Merge on 2021-05-13 09:09:24 +0000. See www.araxis.com for information about Merge. This report uses XHTML and CSS2, and is best viewed with a modern standards-compliant browser. For optimum results when printing this report, use landscape orientation and enable printing of background images and colours in your browser.

415.1 Files compared

#LocationFileLast Modified
1/Applications/Ampps/www/Porto 3.2.2/Theme Files/Magento 2.x/Porto Theme/app/design/frontend/Smartwave/porto_rtl/Smartwave_Porto/web/css/source_module.less2016-06-23 00:12:00 +0000
2/Applications/Ampps/www/Porto v4.0.0/Theme Files/Magento 2.x/Porto Theme/app/design/frontend/Smartwave/porto_rtl/Smartwave_Porto/web/css/source_module.less2021-04-17 02:28:12 +0000

415.2 Comparison summary

DescriptionBetween
Files 1 and 2
Text BlocksLines
Unchanged78694
Changed481026
Inserted14382
Removed1641

415.3 Comparison options

WhitespaceConsecutive whitespace is treated as a single space
Character caseDifferences in character case are significant
Line endingsDifferences in line endings (CR and LF characters) are ignored
CR/LF charactersNot shown in the comparison detail
Active line-pairing rules

415.4 Active regular expressions

No regular expressions were active.

415.5 Comparison detail

1 // /** 1 // /**
2 //  * Copyright © 2015 Magento. All rights reserved. 2 //  * Copyright © 2015 Magento. All rights reserved.
3 //  * See COPYING.txt for license details. 3 //  * See COPYING.txt for license details.
4 //  */ 4 //  */
5 & when (@media-common = true) { 5 & when (@media-common = true) {
6     .theme-color { 6     .theme-color {
7         color: @theme-color !important; 7         color: @theme-color !important;
8     } 8     }
9     .block { 9     .block {
10         .block-title { 10         .block-title {
11             margin: 5px 0 10px; 11             margin: 5px 0 10px;
12             line-height: 1.2; 12             line-height: 1.2;
13             font-size: 16px; 13             font-size: 16px;
14         } 14         }
15     } 15     }
16     // 16     .porto-separator {
17     //  Footer 17       margin: 0 0 22px;
18     //  --------------------------------------------- 18       &.short {
19     .footer { 19           margin: -11px 0 11px;
20         ul {    
21             list-style: none;    
22             margin: 
0
;
    
23             padding: 0;    
24         } 20       }
25         li { 21       &.tall {
26             margin: 
0
;
 22           margin: 22px 0 44px;
27         } 23       }
    24       &.taller {
    25         margin: 44px 0 66px;
28     } 26       }
29     .footer-top { 27       .separator-line {
30          28         margin: 0 auto;
    29         &.align_left {
    30             margin: 0 0 0 auto;
31     } 31         }
32     .footer-middle { 32         &.align_center {
33         background-color: @footer-middle_background-color; 33             margin: 0 auto;
34         color: @footer-middle_font-color; 34         }
35         padding: 40px 0; 35         &.align_right {
36         
 36             margin: 0 auto 0 0;
37         > .container { 37         }
    38       }
    39     }
    40     .porto-ibanner {
    41         z-index: 1;
    42         overflow: hidden;
    43         margin: 0 0 35px;
    44         text-align: center;
    45         &,>img {
    46             display: block;
38             position: relative; 47             position: relative;
39         } 48         }
40          49         >img {
41         [class^="porto-icon-"], [class*=" porto-icon-"] { 50             width: 100%;
42             color: @footer-middle-icon_font-color; 51             transition: opacity 0.35s;
    52             border: none;
    53             padding: 0;
    54             margin: 0;
    55             min-height: inherit;
    56             object-fit: cover;
    57             transition: transform 0.5s,opacity 0.5s;
    58             -webkit-backface-visibility: hidden;
    59             &.porto-lazyload:not(.lazy-load-loaded) {
    60                 visibility: hidden;
43         } 61             }
44         .block { 62         }
    63         &-layer {
45             text-align: right; 64             text-align: right;
46             line-height: 1.5; 65             font-size: 1rem;
47             margin: 0; 66         }
48             width: auto; 67         .porto-ibanner-desc {
49              68             padding: 15px;
50             .block-title { 69             color: #fff;
51                 margin-bottom: 20px; 70             font-size: 1em;
52                  71             -webkit-backface-visibility: hidden;
53                 strong { 72             backface-visibility: hidden;
54                     font-weight: 400; 73             transition: opacity 0.3s;
    74             &.no-padding {
55                     padding: 0; 75                 padding: 0;
56                     font-size: 16px;    
57                     color: @footer-middle-block-title_font-color;    
58                     text-transform: none;    
59                 } 76             }
    77             .porto-ibanner-container {
    78                 position: relative;
    79                 height: 100%;
60             } 80             }
61              81             &:before,&:after {
62             &.newsletter { 82                 pointer-events: none;
63                 width: auto;    
64                     
65                 .form.subscribe {    
66                     max-width: 300px;    
67                 } 83             }
68                 label { 84         }
69                     margin-top50px; 85         .porto-ibanner-desc,.porto-ibanner-link {
    86             position: absolute;
    87             top: 0;
    88             right: 0;
    89             width: 100%;
    90             height: 100%
    91         }
    92         .porto-ibanner-content {
    93             font-size: .8125em;
    94             line-height: 1.6;
    95         }
    96         .porto-ibanner-title,p {
    97             letter-spacing: normal;
    98             padding: 0;
    99             margin
0;
    100             font-size: inherit;
    101             line-height: inherit;
    102             font-weight: inherit;
    103             text-decoration: inherit;
    104             font-style: inherit;
    105             color: inherit;
    106         }
    107         a.porto-ibanner-link {
70                     display: block; 108             display: block;
71                     text-alignright; 109             z-index: 7;
72                     font-size13px; 110             opacity: 0;
    111             background: 0 0;
    112         }
    113     }
    114     ul.products {
    115       .product-col {
    116         padding-left: 10px;
    117         padding-right: 10px;
    118       }
    119       li.product-category {
    120           text-align: center;
    121           a {
    122               text-decoration: none;
    123           }
    124           .thumb-info {
    125               min-height: 90px;
    126               margin-bottom: 0;
    127               text-alignleft;
    128 
    129               h3 {
    130                   font-weight700;
    131                   margin: 0 0 10px;
    132                   color: inherit;
    133                   letter-spacing: -.005em;
    134               }
    135           }
    136           .thumb-info-title {
    137               background: none;
    138               max-width: none;
    139               width: 100%;
    140               bottom: 0;
    141               padding: 1.2em 1.5em;
    142               margin: 0;
    143           }
    144           .thumb-info-type {
    145               display: block;
    146               margin: -10px 0 0;
    147               padding: 0;
73                     font-weight: 400; 148               font-weight: 400;
    149               background: none;
    150               float: none;
    151               opacity: .7;
    152               line-height: 1.8;
    153           }
    154 
    155           mark {
74                     padding: 0; 156               padding: 0;
    157               background: none;
    158               color: inherit;
    159           }
    160           .thumb-info-wrapper:after {
    161               background: rgba(27, 27, 23, .15);
    162               z-index: 1;
    163               opacity: 1;
    164           }
    165           &:hover .thumb-info-wrapper:after {
    166               background: rgba(27, 27, 23, .3);
    167           }
    168       }
    169       li.cat-has-icon {
    170           .thumb-info {
    171               padding: 40px 0 25px;
    172               transition: box-shadow .2s;
    173               text-align: center;
    174               > i {
    175                   font-size: 3em;
    176                   display: inline-block;
75                     margin-bottom: 15px; 177                   margin-bottom: 15px;
76                     line-height: 1.5;    
77                 } 178               }
78                 .field .control:before {    
79                     display: none;    
80                 } 179           }
81                 input { 180           .thumb-info-wrap {
82                     padding: 0 10px; 181               display: block;
83                     background-color: @footer-middle-newsletter-input_background-color;    
84                     border-radius: 0 5px 5px 0;    
85                     height: 30px;    
86                     border: 0;    
87                 } 182           }
88                 .action.subscribe { 183           .thumb-info-title {
89                     border-radius: 5px 0 0 5px; 184               display: block;
90                     height: 30px; 185               position: static;
91                     font-size: 14px; 186               padding: 0 0 10px;
92                     line-height: 30px; 187           }
93                     padding
: 0 13px;
 188       }
    189       &.category-pos-middle li.product-category .thumb-info-title {
    190           position: absolute;
    191           bottom: auto;
    192           top: 50%;
    193           transform: translateY(-50%);
    194       }
    195       &.category-pos-outside li.product-category .thumb-info-title {
    196           position: static;
    197           transform: none;
    198           display: block;
    199           padding-left: 0;
    200           padding-right: 0
;
    201       }
    202       &.category-text-center .thumb-info-title {
    203           text-align: center;
    204       }
    205       &.category-text-right .thumb-info-title {
    206             text-align: left;
    207         }
    208     }
    209     li.product-category {
    210       .thumb-info-title a {
    211         color: inherit
    212       }
    213       .thumb-info-title a:hover {
    214         color: inherit;
    215         text-decoration: underline;
    216       }
    217       .sub-categories {
    218         font-size: .875rem;
94                     font-weight: 400; 219         font-weight: 400;
    220         opacity: .7
95                 } 221       }
96             } 222     }
    223     ul.category-color-dark li.product-category .thumb-info-title {
    224       color: #1d2127;
97         } 225     }
98         ul { 226     .grid-creative {
99             &.links { 227         &.category-pos-outside {
100                 margin-top-5px; 228             li.product-category .thumb-info {
101                 
 229                 height: calc(~"100% - (60px)");
102                 li { 230             }
    231         }
    232     }
    233     .porto-products.show-count-on-hover li.product-category .thumb-info-type {
    234         max-height: 10px;
    235         transition: .5s;
    236         transform: translateY(20%);
    237         opacity: 0;
    238     }
    239     .porto-products.show-count-on-hover li.product-category:hover .thumb-info-type {
    240         max-height: 30px;
    241         transform: translateY(0);
    242         opacity: .7;
    243     }
    244     .porto-products.hide-count {
    245         li.product-category {
    246             .thumb-info-type {
    247                 display: none;
    248             }
    249             .thumb-info h3 {
    250                 margin-bottom0;
    251             }
    252         }
    253     }
    254     .thumb-info {
    255       display: block;
103                     position: relative; 256       position: relative;
104                     padding: 10px 0; 257       text-decoration: none;
105                     line-height: 1; 258       max-width: 100%;
    259       -webkit-backface-visibility: hidden;
    260       backface-visibility: hidden;
    261       -webkit-transform: translate3d(0,0,0);
    262       transform: translate3d(0,0,0);
    263       .thumb-info-wrapper {
    264         -webkit-backface-visibility: hidden;
    265         backface-visibility: hidden;
    266         -webkit-transform: translate3d(0,0,0);
    267         transform: translate3d(0,0,0);
    268         margin: 0;
    269         overflow: hidden;
106                     display: block; 270         display: block;
    271         position: relative;
    272         &:after {
    273           content: "";
    274           transition: all 0.3s;
    275           bottom: 0;
    276           color: #FFF;
    277           left: 0;
    278           position: absolute;
    279           right: 0;
    280           top: 0;
    281           display: block;
    282           opacity: 0;
    283           z-index: 1
    284         }
    285       }
    286       .thumb-info-title {
    287         transition: all 0.3s;
    288         background: rgba(33,37,41,.8);
    289         bottom: 13%;
    290         color: #fff;
    291         font-size: 17px;
    292         font-weight: 600;
    293         right: 0;
    294         letter-spacing: -.05em;
    295         padding: 13px 21px 2px;
    296         position: absolute;
    297         z-index: 2;
    298         max-width: 90%;
    299       }
    300       .thumb-info-inner {
    301         transition: all 0.3s;
    302         display: block;
    303         font: inherit;
    304         color: inherit;
    305         margin-bottom: 0;
    306       }
    307       .thumb-info-type {
    308         display: inline-block;
    309         float: right;
    310         font-size: .6em;
    311         font-weight: 600;
    312         letter-spacing: 0;
    313         margin: 8px 0 -15px -2px;
    314         padding: 2px 12px;
    315         text-transform: uppercase;
    316         z-index: 2;
    317         line-height: 2.3;
    318       }
    319       img {
    320         transition: all 0.3s ease;
    321         position: relative;
    322         width: 100%;
    323       }
    324     }
    325     .single-subscribe {
    326       .newsletter {
    327         .control {
    328           display: flex;
    329           align-items: center;
    330         }
    331         .input-text {display: block;flex:1;}
    332         input {
    333           height: 3rem;
    334           padding-right: 20px;
    335           padding-left: 25px;
    336           border-radius: 0 30px 30px 0;
    337           font-size: .75rem;
    338           color: #777;
    339           border: none;
107                     margin: 0; 340           margin: 0;
108                      341           width: 100%;
109                     [class^="porto-icon-"], [class*=" porto-icon-"] { 342           display: block;
110                         margin-right: -5px;    
111                     } 343         }
    344         .action {
    345           height: 3rem;
    346           padding-left: 20px;
    347           padding-right: 20px;
    348           text-transform: uppercase;
    349           font-weight: 700;
    350           border-radius: 30px 0 0 30px;
112                 } 351         }
113             } 352       }
114             &.contact-info { 353     }
    354     .porto-links-block {
    355       border: 1px solid;
    356       .links-title {
    357         border-bottom: 1px solid;font-size: 1em;font-weight: 700;line-height: 14px;padding: 15px 20px;margin: 0;text-transform: uppercase;position: relative;letter-spacing: .12px;transition: 0.25s;
    358         i {margin-left: 5px;}
    359       }
    360       .links-content ul {list-style: none;padding: 5px 0;margin: 0;}
    361       li.porto-links-item {
    362         display: block;margin: 0;
    363         &:first-child>a,&:first-child>span {border-top-width: 0;}
    364         a,span {display: block;font-size: 1em;line-height: 20px;color: #465157;letter-spacing: .1px;padding: 11px 6px 10px;margin: 0 10px -1px;text-decoration: none;border-top: 1px solid #ddd;}
    365         a:hover {text-decoration: underline;}
    366         i {margin-left: 12px;font-size: 20px;float: right;}
    367         i.icon-image {display: inline-block;vertical-align: middle;float: none;max-width: 20px;}
    368       }
    369     }
    370     .divider {
    371       height: 1px;
    372       &.divider-small {
    373         margin: 22px auto;background: transparent;
    374         &.divider-small-center {
    375           text-align: center;
    376           hr {margin-left: auto;margin-right: auto;}
    377         }
    378         hr {width: 50px;height: 1px;}
    379       }
    380     }
    381     .category-sidebar{
    382       padding: .7143em 0;
    383       list-style:none;
    384       margin:0;
    385       font-size: .9286em;
115                 li { 386       li {
116                     padding: 5px 0; 387         position:relative;
117                      388         margin:0;
118                     &:first-child { 389         color: #777;
119                         padding-top: 0; 390         > a:not(.expand-icon){
    391           display: block;
    392           font-size: .875rem;
    393           font-weight: 600;
    394           padding-top: .625rem;
    395           padding-bottom: .625rem;
    396           border-bottom: 1px solid #e7e7e7;
    397           color: inherit;
120                     } 398         }
    399         >.expand-icon{
    400             position: absolute;
    401             left: -6px;
    402             top: 9px;
    403             font-size: 18px;
    404             line-height: 24px;
    405             color: inherit;
    406             width: 24px;
    407             height: 24px;
    408           em.porto-icon-plus-squared::before {content:"\f807";}
    409           em.porto-icon-minus-squared::before {content:"\f804";}
121                 } 410         }
122                 [class^="porto-icon-"], [class*=" porto-icon-"] { 411       }
    412       > li {
    413         &:last-child {
    414           > a:not(.expand-icon){
    415             border-bottom: 0;
    416           }
    417         }
    418       }
    419       ul{display:none;list-style:none;padding-right: 1.0714em;margin:0}
    420     }
    421     .onepage-category{
    422       >.category-list{
    423         position:fixed;
    424         right:0;
    425         top:0;
    426         bottom: 0;
    427         min-height:100%;
    428         width:80px;
    429         text-align:left;
    430         background:#222529;
    431         padding:32px 0 0;
    432         z-index:20;
    433         >ul{
    434           position:relative;
    435           z-index:2;
    436           list-style:none;
    437           padding:0;
    438           transition:all .3s;
    439           padding-top:0;
    440           margin-bottom:0;
    441           >li{
    442             margin: 0;margin-bottom: 1rem;
    443             >a{
    444               color:#fff;
    445               width:auto;
    446               line-height:79px;
    447               display:inline-block;
    448               white-space:nowrap;
    449               position:relative;
    450               transition:all .3s;
    451               >em{
    452                 font-size:1.6875rem;
    453                 width:80px;
    454                 display:inline-block;
    455                 text-align:center;
    456                 vertical-align:middle;
    457                 >img{
    458                   vertical-align:middle;
    459                 }
    460               }
    461               >span{
    462                 display:inline-block;
    463                 vertical-align:middle;
    464                 opacity:0;
    465                 visibility:hidden;
    466                 width:0;
    467                 transition:all .3s;
    468                 font-size:16px;
    469                 font-weight:600;
    470                 position:relative;
    471                 overflow:hidden;
    472               }
    473               &:after{
    474                 content:"";
    475                 width:16px;
    476                 height:16px;
    477                 position:absolute;
    478                 display:block;
    479                 left:-15px;
    480                 top:50%;
    481                 margin-top:-8px;
    482                 border:8px solid transparent;
    483                 transition:all .3s;
    484               }
    485               &.active,&:hover{
    486                 background-color:#00d59d;
    487                 &:after{
    488                   border-right-color:#00d59d;
    489                 }
    490               }
    491               &:hover {
    492                 >span{
    493                   opacity:1;
    494                   visibility:visible;
    495                   width:auto;
    496                   padding-left:50px;
    497                 }
    498               }
    499             }
    500             &:last-child{margin-bottom:0;}
    501           }
    502         }
    503       }
    504       >.category-details{
    505         position:relative;
    506         float:left;
    507         width:100%;
    508         min-height:80vh;
    509       }
    510       .category-details{
    511         padding: 70px 0;
    512         .title-menu{
    513           position:relative;
    514           margin-bottom: 25px;
    515           >a{
    516             font-family: 'Poppins';
    517             color: #222529;
123                     display: inline-block; 518             display: inline-block;
124                     vertical-align: top; 519             margin-top: 0;
125                     font-size: 14px; 520             font-size: 1.375rem;
126                     line-height: 18px; 521             font-weight: 600;
127                     margin-right: -5px; 522             letter-spacing: .025em;
128                     margin-left: 3px; 523             line-height: 46px;
    524             text-transform: uppercase;
    525             >span{
    526               display:inline-block;
    527               vertical-align:middle;
129                 } 528             }
130                 p { 529             &.parent{
    530               &:after{
    531                 display:inline-block;
    532                 content:"\f813";
    533                 font-family:porto-icons;
    534                 margin-right:18px;
    535                 font-size:18px;
    536                 vertical-align:middle;
    537                 line-height:36px;
    538               }
    539               &.opened:after{content:"\f810";}
    540             }
    541           }
    542           >.menu-popup{
    543             position:absolute;
    544             right: 0;
    545             top:100%;
    546             display:none;
    547             width:100%;
    548             z-index:3;
    549             background-color:#fff;
    550             border:1px solid #bebebe;
    551             border-radius:5px;
    552             padding:50px 0;
    553             &:before{
    554               content:"";
    555               border:8px solid transparent;
    556               width:16px;
    557               height:16px;
    558               display:block;
    559               border-bottom-color:#bebebe;
    560               position:absolute;
    561               top:-16px;
    562               right:90px;
    563             }
    564             &:after{
    565               content:"";
    566               border:7px solid transparent;
    567               width:14px;
    568               height:14px;
    569               display:block;
    570               border-bottom-color:#fff;
    571               position:absolute;
    572               top:-13px;
    573               right:91px;
    574             }
    575           }
    576         }
    577         .menu-popup {
    578           ul{
    579             list-style:none;
    580             padding:0;
    581             margin:0;
    582             >li> a{
    583               color:#000;
    584               font-size:16px;
    585               line-height:2.5;
    586             }
    587           }
    588           >ul{
    589             display:flex;
    590             flex-wrap:wrap;
    591             >li{
    592               float:right;
    593               border-right:1px solid #bebebe;
    594               margin:10px 0;
    595               padding:30px 0;
    596               > a{
    597                 font-weight:700;
    598                 text-transform:uppercase;
    599               }
    600             }
    601             &.columns5>li{
    602               width:20%;
    603               padding-right:4%;
    604               padding-left:4%;
    605               &:nth-child(5n+1){
    606                 border-right:0;
    607                 clear:right;
    608               }
    609             }
    610           }
    611           li.menu-item{margin-bottom:0;}
    612         }
    613         .products-area{
    614           .category-link{
    615             float:left;
    616             margin-top:-60px;
    617             margin-right:0;
    618             position:relative;
    619             z-index:2;
    620             font-size: .8125rem;
    621             padding: 1em 3em;
    622             letter-spacing: .01em;
    623             font-weight: 700;
    624             line-height: 1.42857;
    625             background: #222529;
    626             border: 1px solid transparent;
    627             color: #fff;
    628             text-transform: uppercase;
    629           }
    630         }
    631       }
    632       .additional-content {
    633         margin-bottom: 1.5vw;
    634         img{
    635           max-width:100%;
    636         }
    637       }
    638       .menu-popup a>span{
    639         position:relative;
    640         >span.cat-label{
    641           top:3px;
    642           left:-35px;
    643           font:inherit;
    644           font-size:9px;
    645           padding:2px;
    646           z-index:1;
    647           border-radius:2px;
    648           line-height:1;
    649           border:1px solid #777;
    650           position:absolute;
    651         }
    652       }
    653       .onepage-category & {
    654         display:flex;
    655         flex-wrap:wrap;
    656       }
    657     }
    658     .onepage-cat.category-list {position: fixed;width: 80px;right: 0;height: 100%;top: 0;bottom: 0;}
    659     body>.onepage-cat.category-list {
    660         display: none;
    661     }
    662     // vc columns
    663     .pt_row {
    664       &.pt_row-no-padding {
    665         .pt_column-inner {
    666           padding-left: 0;
    667           padding-right: 0;
    668         }
    669       }
    670     }
    671 
    672     .pt_row-no-padding {
    673       .pt_inner {
    674         margin-left: 0;
    675         margin-right: 0;
    676       }
    677     }
    678 
    679     .pt_row {
    680       &.pt_row-o-full-height {
    681         min-height: 100vh;
    682       }
    683 
    684       // enable flex
    685       &.pt_row-flex {
    686         box-sizing: border-box;
    687         display: -webkit-box;
    688         display: -webkit-flex;
    689         display: -ms-flexbox;
    690         display: flex;
    691         -webkit-flex-wrap: wrap;
    692         -ms-flex-wrap: wrap;
    693         flex-wrap: wrap;
    694 
    695         > .pt_column_container {
    696           display: -webkit-box;
    697           display: -webkit-flex;
    698           display: -ms-flexbox;
    699           display: flex;
    700           > .pt_column-inner {
    701             -webkit-box-flex: 1;
    702             -webkit-flex-grow: 1;
    703             -ms-flex-positive: 1;
    704             flex-grow: 1;
    705             display: -webkit-box;
    706             display: -webkit-flex;
    707             display: -ms-flexbox;
    708             display: flex;
    709             -webkit-box-orient: vertical;
    710             -webkit-box-direction: normal;
    711             -webkit-flex-direction: column;
    712             -ms-flex-direction: column;
    713             flex-direction: column;
    714             z-index: 1;
    715             max-width: 100%;
    716             @media (-ms-high-contrast: active), (-ms-high-contrast: none) {
    717               /* IE10+ specific styles */
    718               & > * {
    719                 min-height: 1em;
    720               }
    721             }
    722           }
    723         }
    724 
    725         &::before,
    726         &::after {
    727           display: none;
    728         }
    729       }
    730 
    731       // columns alignment
    732       &.pt_row-o-columns-stretch {
    733         -webkit-align-content: stretch;
    734         -ms-flex-line-pack: stretch;
    735         align-content: stretch;
    736       }
    737       &.pt_row-o-columns-top {
    738         -webkit-align-content: flex-start;
    739         -ms-flex-line-pack: start;
    740         align-content: flex-start;
    741       }
    742       &.pt_row-o-columns-bottom {
    743         -webkit-align-content: flex-end;
    744         -ms-flex-line-pack: end;
    745         align-content: flex-end;
    746       }
    747       &.pt_row-o-columns-middle {
    748         -webkit-align-content: center;
    749         -ms-flex-line-pack: center;
    750         align-content: center;
    751       }
    752       &.pt_row-o-columns-top,
    753       &.pt_row-o-columns-bottom,
    754       &.pt_row-o-columns-middle {
    755         &::after {
    756           content: '';
    757           width: 100%;
    758           height: 0;
    759           overflow: hidden;
    760           visibility: hidden;
    761           display: block;
    762         }
    763       }
    764 
    765       // equal height
    766       &.pt_row-o-equal-height {
    767         > .pt_column_container {
    768           -webkit-box-align: stretch;
    769           -webkit-align-items: stretch;
    770           -ms-flex-align: stretch;
    771           align-items: stretch;
    772         }
    773       }
    774 
    775       // content alignment
    776       &.pt_row-o-content-top {
    777         > .pt_column_container {
    778           > .pt_column-inner {
    779             -webkit-box-pack: start;
    780             -webkit-justify-content: flex-start;
    781             -ms-flex-pack: start;
    782             justify-content: flex-start;
    783           }
    784         }
    785         &:not(.pt_row-o-equal-height) {
    786           > .pt_column_container {
    787             -webkit-box-align: start;
    788             -webkit-align-items: flex-start;
    789             -ms-flex-align: start;
    790             align-items: flex-start;
    791           }
    792         }
    793       }
    794       &.pt_row-o-content-bottom {
    795         > .pt_column_container {
    796           > .pt_column-inner {
    797             -webkit-box-pack: end;
    798             -webkit-justify-content: flex-end;
    799             -ms-flex-pack: end;
    800             justify-content: flex-end;
    801           }
    802         }
    803         &:not(.pt_row-o-equal-height) {
    804           > .pt_column_container {
    805             -webkit-box-align: end;
    806             -webkit-align-items: flex-end;
    807             -ms-flex-align: end;
    808             align-items: flex-end;
    809           }
    810         }
    811       }
    812       &.pt_row-o-content-middle {
    813         > .pt_column_container {
    814           > .pt_column-inner {
    815             -webkit-box-pack: center;
    816             -webkit-justify-content: center;
    817             -ms-flex-pack: center;
    818             justify-content: center;
    819           }
    820         }
    821         &:not(.pt_row-o-equal-height) {
    822           > .pt_column_container {
    823             -webkit-box-align: center;
    824             -webkit-align-items: center;
    825             -ms-flex-align: center;
    826             align-items: center;
    827           }
    828         }
    829       }
    830     }
    831 
    832     // Clearfix for column
    833     .pt_column-inner {
    834       &::before,
    835       &::after {
    836         content: " ";
    837         display: table;
    838       }
    839       &::after {
    840         clear: both;
    841       }
    842     }
    843     //
    844     //  Footer
    845     //  ---------------------------------------------
    846     .widget {
    847       &:first-child {margin-top: 0;}
    848       .tagcloud {
    849         margin-top: -.3846em;
    850         margin-bottom: -.3846em;
    851         a {
    852           margin: .3846em 0 .3846em .3846em;
    853           padding: .25rem .5rem;
    854           line-height: 1;
131                     display: inline-block; 855           display: inline-block;
132                     vertical-align: top; 856           text-decoration: none;
    857           font-size: .75em!important;
    858           text-transform: uppercase;
    859           font-weight: 700;
    860           border-radius: 10px;
    861         }
    862       }
    863       &.contact-info {
    864         ul,li {
    865           border-width: 0;
133                     margin: 0; 866           margin: 0;
    867           padding: 0;
    868         }
    869         li {
    870           a{
    871             &:hover {text-decoration: underline;}
    872           }
    873           &:not(:last-child) {margin-bottom: 10px;}
    874         }
    875         p {margin-bottom: 10px;}
    876         i {clear: both;float: right;text-align: center;width: 16px;top: -2px;margin: 4px 0 10px 9px;font-size: 1.3em;position: static!important;}
    877         .contact-details {
    878           strong,span {display: block;padding-right: 25px;}
    879         }
    880       }
    881       &.follow-us {
    882         .share-links {
    883           a {
    884             width: 30px;
    885             height: 30px;
    886             border-radius: 30px;
    887             margin: 2px;
    888             overflow: hidden;
    889             box-shadow: 0 2px 2px 0 rgba(0,0,0,.3);
    890             transition: all 0.2s;
    891             font-size: 14px;
    892             &:hover {color: #fff;}
134                 } 893           }
135             } 894         }
136             &.features { 895       }
137                 margin-top-5px; 896     }
138                 
 897     .footer {
    898       &, p {
    899         font-size: 13px;
    900         line-height: 24px;
    901         letter-spacing: .065px;
    902       }
    903       ul {
    904           list-style: none;
    905           margin
0;
    906           padding: 0;
    907       }
139                 li { 908       li {
    909           margin: 0;
    910       }
    911       .widget {
    912         margin-bottom: 20px;
    913         p {margin-top: -3px;margin-bottom: 13px;font-size: 1em;}
    914         & + .widget {
    915           margin-top: 20px;
    916         }
    917         .tagcloud a {
    918           background: none;
    919           color: inherit;
    920           border-radius: 0;
    921           font-size: 11px!important;
    922           font-weight: 400;
    923           text-transform: none;
    924           padding: .6em;
    925           border: 1px solid #313438;
    926         }
    927         &.contact-info {
    928           .contact-details strong {
    929             font-weight: 400;
    930           }
    931           i {display: none;}
    932         }
    933       }
    934       .follow-us {
    935         .share-links a {
    936           width: 40px;
    937           height: 40px;
    938           border-radius: 20px;
    939           border: 1px solid #313438;
    940           box-shadow: none;
    941           &:not(:hover) {
    942             background: none;color: #fff;
    943           }
    944           &:hover {
    945             border-color: #fff;
    946             color: #fff;
    947           }
    948         }
    949       }
    950       .contact-info {
    951         .contact-info-block {
    952           .contact-details {
    953             strong, span {
    954               padding-right: 0;
    955             }
    956             strong {line-height: 1em;color: #fff;}
    957           }
    958         }
    959       }
    960       .newsletter {
    961         margin-bottom: 0;
    962         label {
    963           display: none;
    964         }
    965         .field .control:before {
    966           display: none;
    967         }
    968         input {
    969           height: 48px;
    970           padding-left: 25px;
    971           padding-right: 25px;
    972           border-radius: 0 30px 30px 0;
    973           font-size: .75rem;
    974           color: #777;
    975           border: none;
    976         }
    977         .action.subscribe {
    978           height: 48px;
    979           padding-left: 25px;
    980           padding-right: 25px;
    981           text-transform: uppercase;
    982           font-weight: 700;
    983           font-size: .75rem;
    984           border-radius: 30px 0 0 30px;
    985           border: none;
    986         }
    987       }
    988     }
    989     .footer-top {
    990       .custom-block {
    991         display: flex;
    992         -ms-flex-align: center;
    993         align-items: center;
    994         -ms-flex-pack: justify;
    995         justify-content: space-between;
    996         -ms-flex-wrap: wrap;
    997         flex-wrap: wrap;
    998         &:before, &::after {
    999             content: '';
    1000             display: block;
    1001             border-top: 1px solid #e7e7e7;
    1002             -ms-flex: 0 0 100%;
    1003             flex: 0 0 100%;
    1004         }
    1005         &:before {
    1006             margin-bottom: 40px;
    1007         }
    1008         &:after {
    1009             margin-top: 40px;
    1010         }
    1011       }
    1012       .widget:last-child {
    1013         margin-bottom: 0;
    1014       }
    1015     }
    1016     .footer-middle {
    1017         background-color: @footer-middle_background-color;
    1018         color: @footer-middle_font-color;
    1019         > .container {
140                     position: relative; 1020             position: relative;
141                     padding: 10px 0; 1021             padding-top: 4rem;padding-bottom: 1.5rem;
142                     line-height: 1; 1022             &::after {
    1023               content: '';
143                     display: block; 1024               display: block;
144                     
 1025               position: absolute;
    1026               left: 10px;
    1027               bottom: 0;
    1028               right: 10px;
    1029               border-bottom: 1px solid #313438;
    1030             }
    1031         }
145                     [class^="porto-icon-"], [class*=" porto-icon-"] { 1032         [class^="porto-icon-"], [class*=" porto-icon-"] {
146                         margin-right: -5px; 1033             color: @footer-middle-icon_font-color;
147                         margin-left: 3px;    
148                     } 1034         }
    1035         .widget_media_image img {
    1036           max-width: 111px;
    1037           height: auto;
    1038           display: block;
    1039         }
    1040         .block {
    1041           text-align: right;
    1042           line-height: 1.5;
    1043           margin: 0;
    1044           width: auto;
    1045           .block-title {
    1046             margin-bottom: 20px;
    1047             strong {
    1048               font-weight: 400;
    1049               padding: 0;
    1050               font-size: 16px;
    1051               color: @footer-middle-block-title_font-color;
    1052               text-transform: none;
149                 } 1053             }
150             } 1054           }
151         } 1055         }
152         a { 1056         a {
153             &, &:hover, &:focus { 1057             &, &:hover, &:focus {
154                 color: @footer-middle-link_font-color; 1058                 color: @footer-middle-link_font-color;
155             } 1059             }
156         } 1060         }
157         p {    
158             margin-bottom: 15px;    
159             line-height: 1.5;    
160         }    
161     } 1061     }
162     .footer-bottom { 1062     .footer-bottom {
163         min-height: 50px;    
164         line-height: 40px;    
165         background-color: @footer-bottom_background-color; 1063         background-color: @footer-bottom_background-color;
166         padding: 25px 0; 1064         padding: 15px 0;
167         
 1065         font-size: .9em;
    1066         >.container {
    1067           display: -webkit-flex;
    1068           display: flex;
    1069           -webkit-align-items: center;
    1070           align-items: center;
    1071           justify-content: space-between;
    1072           flex-wrap: wrap;
    1073         }
    1074         .widget {
    1075           display: inline-block;
    1076           margin: 0;
    1077         }
168         .logo { 1078         .logo {
169             margin: 0; 1079             margin: 0;
170             margin-left: 45px; 1080             margin-left: 45px;
171             float: right; 1081             float: right;
172         } 1082         }
173             
174         .custom-block { 1083         .custom-block {
175             float: right; 1084             float: right;
176             line-height: 1; 1085             line-height: 1;
177             margin: 3px 0; 1086             margin: 3px 0;
178                 
179             img { 1087             img {
180                 display: inline-block; 1088                 display: inline-block;
181                 vertical-align: middle; 1089                 vertical-align: middle;
182             } 1090             }
183         }            
184         .social-icons {    
185             display: inline-block;    
186             vertical-align: middle;    
187             margin-left: 60px;    
188         } 1091         }
189         address { 1092         address {
190             float: left; 1093           order: 1;
191             line-height: 30px; 1094           padding: 10px 8px 10px 0;
192             margin
0;
 1095           text-align: right;
    1096           margin-rightauto;
    1097           flex: auto;
193         } 1098         }
194         .custom-block { 1099         .custom-block {
195             &.f-right { 1100             &.f-right {
196                 margin-right: 60px; 1101               margin: 0;order: 2;
197             } 1102               padding: 10px 8px 10px 0;
198             ul.links { 1103               text-align: left;
199                 display: inline-block; 1104               flex: auto;
200                     
201                 li {    
202                     padding: 0 12px
;
    
203                     border-left: 1px solid #bbb;    
204                     font-size: 11px;    
205                     display: inline;    
206                     vertical-align: middle;    
207     
208                     &:first-child {    
209                         padding-right: 0;    
210                     }    
211                 }    
212                 a {    
213                     color: #777;    
214                     font-size: 11px;    
215                 }    
216             } 1105             }
217         } 1106         }
218         .switcher { 1107         .switcher {
219             line-height: 1 !important; 1108             line-height: 1 !important;
220             display: block; 1109             display: block;
221             height: auto; 1110             height: auto;
222             margin-top: 15px; 1111             margin-top: 15px;
223             float: right; 1112             float: right;
224              1113 
225             label { 1114             label {
226                 display: none; 1115                 display: none;
227             } 1116             }
228             select { 1117             select {
229                 display: inline-block; 1118                 display: inline-block;
230                 width: auto; 1119                 width: auto;
231                 line-height: 1; 1120                 line-height: 1;
232             } 1121             }
233         } 1122         }
234     } 1123     }
235     .footer-ribbon { 1124     .footer-ribbon {
236         position: absolute;    
237         margin: -56px 0 25px;    
238         padding: 10px 20px 6px 20px;    
239         background-color: @footer-ribbon_background-color; 1125         background-color: @footer-ribbon_background-color;
240         &:before {    
241             content: '';    
242             display: block;    
243             width: 7px;    
244             height: 0;    
245             position: absolute; 1126         position: absolute;
246             right: -10px;    
247             top: 0; 1127         top: 0;
248             border-left: 10px solid darken(@footer-ribbon_background-color, 10%); 1128         margin: -16px 0 0;
249             border-top: 16px solid transparent; 1129         padding: 10px 20px 6px;
250         } 1130         color: #fff;
    1131         font-size: 1.6em;
    1132         z-index: 4;
251         span { 1133         span {
252             color: @footer-ribbon_font-color; 1134             color: @footer-ribbon_font-color;
253             font-size: 20px;    
254             font-family: "Shadows Into Light",cursive; 1135             font-family: "Shadows Into Light",cursive;
255             line-height: 1; 1136             line-height: 1;
256         } 1137         }
257     } 1138         &:before {
258     .social-icons { 1139           content: "";
259          1140           display: 
block;
260         li { 1141           height: 0;
261             display: inline-block; 1142           position: absolute;
262             vertical-align: middle; 1143           top: 0;
263              1144           width: 7px;
264             &:first-child a { 1145           left: 100%;
265                 margin-right: 0; 1146           border-left: 10px solid #646464;
266             } 1147           border-top: 16px solid transparent;
267         }    
268         > li > a {    
269             display: inline-block;    
270             width: 30px;    
271             height: 30px;    
272             background-color: #9e9e9e;    
273             line-height: 30px;    
274             text-align: center;    
275             border-radius: 50%;    
276             color: #fff;    
277             font-size: 16px;    
278             margin-right: 7px;    
279             transition: 0.3s background-color;    
280             &:hover, &:focus {    
281                 color: #fff;    
282             }    
283             &.facebook-link:hover {    
284                 background-color: #3c599b;    
285             }    
286             &.twitter-link:hover {    
287                 background-color: #1ca8e3;    
288             }    
289             &.linkedin-link:hover {    
290                 background-color: #4975b6;    
291             }    
292         } 1148         }
293     } 1149     }
294      1150 
295     /*** About US ***/ 1151     /*** About US ***/
296     h2.word-rotator-title { 1152     h2.word-rotator-title {
297         line-height: 30px; 1153         line-height: 30px;
298         font-size: 20px; 1154         font-size: 20px;
299         font-weight: 300; 1155         font-weight: 300;
300         margin: 0 0 20px 0; 1156         margin: 0 0 20px 0;
301         color: #121214; 1157         color: #121214;
302     } 1158     }
303     .word-rotate { 1159     .word-rotate {
304         visibility: hidden; 1160         visibility: hidden;
305         width: 100px; 1161         width: 100px;
306         height: 0; 1162         height: 0;
307         margin-bottom: -7px; 1163         margin-bottom: -7px;
308         display: inline-block; 1164         display: inline-block;
309         overflow: hidden; 1165         overflow: hidden;
310         text-align: center; 1166         text-align: center;
311         position: relative; 1167         position: relative;
312          1168 
313         h2 & { 1169         h2 & {
314             margin-bottom: -7px 1170             margin-bottom: -7px
315         }         1171         }
316         &.active { 1172         &.active {
317             visibility: visible; 1173             visibility: visible;
318             width: auto; 1174             width: auto;
319         } 1175         }
320         .word-rotate-items { 1176         .word-rotate-items {
321             position: relative; 1177             position: relative;
322             top: 0; 1178             top: 0;
323             width: 100%; 1179             width: 100%;
324              1180 
325             span { 1181             span {
326                 display: block; 1182                 display: block;
327                 white-space: nowrap; 1183                 white-space: nowrap;
328             } 1184             }
329         } 1185         }
330     } 1186     }
331     p .alternative-font { 1187     p .alternative-font {
332         display: inline-block; 1188         display: inline-block;
333         margin-top: -15px; 1189         margin-top: -15px;
334         position: relative; 1190         position: relative;
335         top: 3px; 1191         top: 3px;
336         margin-bottom: -6px; 1192         margin-bottom: -6px;
337         color: @theme-color; 1193         color: @theme-color;
338         font-family: "Shadows Into Light",cursive; 1194         font-family: "Shadows Into Light",cursive;
339         font-size: 1.6em; 1195         font-size: 1.6em;
340     } 1196     }
341     .btn-primary { 1197     .btn-primary {
342         color: #fff; 1198         color: #fff;
343         text-shadow: 0 -1px 0 rgba(0,0,0,.25); 1199         text-shadow: 0 -1px 0 rgba(0,0,0,.25);
344         background-color: @button-primary__background; 1200         background-color: @button-primary__background;
345         border-color: @button-primary__background; 1201         border-color: @button-primary__background;
346          1202 
347         &:hover { 1203         &:hover {
348             color: #fff; 1204             color: #fff;
349             opacity: 0.85; 1205             opacity: 0.85;
350         } 1206         }
351     } 1207     }
352     .btn { 1208     .btn {
353         display: inline-block; 1209         display: inline-block;
354         margin-bottom: 0; 1210         margin-bottom: 0;
355         font-weight: normal; 1211         font-weight: normal;
356         text-align: center; 1212         text-align: center;
357         vertical-align: middle; 1213         vertical-align: middle;
358         cursor: pointer; 1214         cursor: pointer;
359         background-image: none; 1215         background-image: none;
360         border: 1px solid transparent; 1216         border: 1px solid transparent;
361         white-space: nowrap; 1217         white-space: nowrap;
362         padding: 6px 12px; 1218         padding: 6px 12px;
363         font-size: 14px; 1219         font-size: 14px;
364         line-height: 1.42857143; 1220         line-height: 1.42857143;
365         border-radius: 4px; 1221         border-radius: 4px;
366          1222 
367         &:hover { 1223         &:hover {
368             text-decoration: none; 1224             text-decoration: none;
369         } 1225         }
370  1226 
371         &-lg { 1227         &-lg {
372             padding: 10px 16px; 1228             padding: 10px 16px;
373             font-size: 18px; 1229             font-size: 18px;
374             line-height: 1.33; 1230             line-height: 1.33;
375             border-radius: 6px; 1231             border-radius: 6px;
376         } 1232         }
377     } 1233     }
378     .push-top { 1234     .push-top {
379         margin-top: 20px; 1235         margin-top: 20px;
380     } 1236     }
381     hr.tall { 1237     hr.tall {
382         margin: 30px 0; 1238         margin: 30px 0;
383         background-image: -webkit-linear-gradient(left,transparent,rgba(0,0,0,.2),transparent); 1239         background-image: -webkit-linear-gradient(left,transparent,rgba(0,0,0,.2),transparent);
384         background-image: linear-gradient(left,transparent,rgba(0,0,0,.2),transparent); 1240         background-image: linear-gradient(left,transparent,rgba(0,0,0,.2),transparent);
385         border: 0; 1241         border: 0;
386         height: 1px; 1242         height: 1px;
387     } 1243     }
388     .entry-content { 1244     .entry-content {
389         h3 { 1245         h3 {
390             font-size: 1.7em; 1246             font-size: 1.7em;
391             font-weight: normal; 1247             font-weight: normal;
392             color: @theme-color; 1248             color: @theme-color;
393             letter-spacing: normal; 1249             letter-spacing: normal;
394             line-height: 24px; 1250             line-height: 24px;
395             margin-bottom: 33px; 1251             margin-bottom: 33px;
396             text-transform: uppercase; 1252             text-transform: uppercase;
397         } 1253         }
398         p { 1254         p {
399             font-size: 14px; 1255             font-size: 14px;
400             line-height: 24px; 1256             line-height: 24px;
401             margin-bottom: 20px; 1257             margin-bottom: 20px;
402         } 1258         }
403         .lead { 1259         .lead {
404             font-size: 21px; 1260             font-size: 21px;
405             line-height: 1.4; 1261             line-height: 1.4;
406         } 1262         }
407     } 1263     }
408     .history { 1264     .history {
409         margin: 25px 0; 1265         margin: 25px 0;
410         padding: 0; 1266         padding: 0;
411         clear: both; 1267         clear: both;
412          1268 
413         .thumb { 1269         .thumb {
414             background: transparent url(../images/history-thumb.png) no-repeat 0 0; 1270             background: transparent url(../images/history-thumb.png) no-repeat 0 0;
415             width: 227px; 1271             width: 227px;
416             height: 160px; 1272             height: 160px;
417             margin: 0 0 30px; 1273             margin: 0 0 30px;
418             padding: 0; 1274             padding: 0;
419             float: right; 1275             float: right;
420  1276 
421             img { 1277             img {
422                 border-radius: 50%; 1278                 border-radius: 50%;
423                 margin: 7px 8px; 1279                 margin: 7px 8px;
424                 width: 145px; 1280                 width: 145px;
425                 height: 145px; 1281                 height: 145px;
426             } 1282             }
427         } 1283         }
428         h4 { 1284         h4 {
429             float: right; 1285             float: right;
430             margin: 15px 0; 1286             margin: 15px 0;
431             padding: 0; 1287             padding: 0;
432             color: @theme-color; 1288             color: @theme-color;
433             line-height: 27px; 1289             line-height: 27px;
434         } 1290         }
435         p { 1291         p {
436             margin: 0; 1292             margin: 0;
437             margin-right: 55px; 1293             margin-right: 55px;
438             line-height: 24px; 1294             line-height: 24px;
439         } 1295         }
440     } 1296     }
441     .featured-box { 1297     .featured-box {
442         background: #f5f5f5; 1298         background: #f5f5f5;
443         background-color: transparent; 1299         background-color: transparent;
444         background: linear-gradient(to bottom,white 1%,#f9f9f9 98%) repeat scroll 0 0 transparent; 1300         background: linear-gradient(to bottom,white 1%,#f9f9f9 98%) repeat scroll 0 0 transparent;
445         box-sizing: border-box; 1301         box-sizing: border-box;
446         border-bottom: 1px solid #DFDFDF; 1302         border-bottom: 1px solid #DFDFDF;
447         border-left: 1px solid #ECECEC; 1303         border-left: 1px solid #ECECEC;
448         border-radius: 8px; 1304         border-radius: 8px;
449         border-right: 1px solid #ECECEC; 1305         border-right: 1px solid #ECECEC;
450         box-shadow: 0 1px 1px 0 rgba(0,0,0,0.04); 1306         box-shadow: 0 1px 1px 0 rgba(0,0,0,0.04);
451         margin-bottom: 20px; 1307         margin-bottom: 20px;
452         margin-left: auto; 1308         margin-left: auto;
453         margin-right: auto; 1309         margin-right: auto;
454         margin-top: 20px; 1310         margin-top: 20px;
455         min-height: 100px; 1311         min-height: 100px;
456         position: relative; 1312         position: relative;
457         text-align: center; 1313         text-align: center;
458         z-index: 1; 1314         z-index: 1;
459          1315 
460         .box-content { 1316         .box-content {
461             border-radius: 8px; 1317             border-radius: 8px;
462             border-top: 4px solid @theme-color; 1318             border-top: 4px solid @theme-color;
463             padding: 30px 20px; 1319             padding: 30px 20px;
464         } 1320         }
465         h4 { 1321         h4 {
466             font-size: 1.3em; 1322             font-size: 1.3em;
467             font-weight: 400; 1323             font-weight: 400;
468             letter-spacing: -0.7px; 1324             letter-spacing: -0.7px;
469             text-transform: uppercase; 1325             text-transform: uppercase;
470         } 1326         }
471         .block-flickr-photos { 1327         .block-flickr-photos {
472             border: 0; 1328             border: 0;
473  1329 
474             .block-title { 1330             .block-title {
475                 display: none; 1331                 display: none;
476             } 1332             }
477             a.flickr-image { 1333             a.flickr-image {
478                 margin: 5px; 1334                 margin: 5px;
479                 display: inline-block; 1335                 display: inline-block;
480                 border: 1px solid #dcdcdc; 1336                 border: 1px solid #dcdcdc;
481                 padding: 5px; 1337                 padding: 5px;
482                 border-radius: 5px; 1338                 border-radius: 5px;
483                  1339 
484                 img { 1340                 img {
485                     max-width: 100%; 1341                     max-width: 100%;
486                     width: 75px; 1342                     width: 75px;
487                 } 1343                 }
488             } 1344             }
489         } 1345         }
490     } 1346     }
491     .history .featured-box { 1347     .history .featured-box {
492         text-align: right; 1348         text-align: right;
493         margin-right: 225px; 1349         margin-right: 225px;
494         margin-bottom: 35px; 1350         margin-bottom: 35px;
495         min-height: 115px; 1351         min-height: 115px;
496          1352 
497         .box-content { 1353         .box-content {
498             border-top-color: @theme-color; 1354             border-top-color: @theme-color;
499         } 1355         }
500     } 1356     }
501     #newsletter_popup { 1357     #newsletter_popup {
502         background
url(../images/newsletter_popup_bg.jpg) no-repeat;
 1358         background#ffffff url(../images/shop_newsletter_popup.jpg) no-repeat;
    1359         box-shadow: 0 0 50px rgba(0, 0, 0, .12);
    1360         background-position: center;
    1361         background-size: cover;
    1362         padding: 4rem 2.5rem;
503         margin: 0; 1363         margin: 0;
504         padding: 40px 40px 25px; 1364         width: 740px;
505         width: 700px; 1365         min-height: 300px;
506         
height: 325px;
    
507         border-top: 4px solid @theme-color;    
508         text-align: right; 1366         text-align: right;
509         position: relative; 1367         position: relative;
510         border-radius: 5px; 1368         .text_left {
511          1369           img {
512         .block-content { 1370             max-width: 111px;
513             max-width: 312px; 1371             display: block;
514             text-align: center;    
515             padding: 6px;    
516         }    
517         h2 {    
518             font-weight: 700;    
519             color: #313131;    
520             font-size: 16px;    
521             line-height: 1;    
522             margin: 30px 0 12px;    
523         }    
524         p {    
525             font-size: 13px;    
526             line-height: 1.4;    
527         } 1372           }
528         .input-box {    
529             padding: 0;    
530         } 1373         }
    1374         form.subscribe {display: flex;align-items: center;}
    1375         .field {flex: 1;}
    1376         .field,.actions {margin-bottom: 20px;}
531         input[type="email"] { 1377         input[type="email"] {
532             float: right; 1378           height: 3rem;
533             padding: 2px 13px; 1379           border: none;
534             line-height: 30px; 1380           border-radius: 0 1.5rem 1.5rem 0;
535             width: 100%; 1381           background: #f4f4f4;
536             height: 34px; 1382           box-shadow: none !important;
537         } 1383           padding-right: 1.375rem;
538         .actions {    
539             float: right;    
540             margin-right: -55px;    
541             position: relative;    
542             z-index: 1;    
543             width: 55px;    
544             border-right: 1px solid #ccc;    
545         } 1384         }
546         .action.primary { 1385         .action.primary {
547             height: 34px; 1386             height: 3rem;
548             background-color: transparent; 1387             padding-left: 2rem;
    1388             padding-right: 1.5rem;
    1389             border-radius: 1.5rem 0 0 1.5rem;
    1390             box-shadow: none !important;
    1391             margin-left: .5rem;
    1392             font-weight: 700;
    1393         }
    1394         label.checkbox {
    1395             display: inline-block;
    1396             margin-top: 0;
    1397             margin-bottom: 0;
    1398             margin-left: 5px;
    1399         }
    1400         .checkbox {
    1401             font-size: .75rem;
    1402             input[type="checkbox"] {
    1403                 -webkit-appearance: none;
    1404                 -moz-appearance: none;
    1405                 border: 1px solid #ccc;
    1406                 width: 1.25rem;
    1407                 height: 1.25rem;
    1408                 margin-top: -.1rem;
    1409                 margin-left: 1px;
    1410                 margin-right: 5px;
    1411                 vertical-align: middle;
    1412                 outline: none;
    1413                 border-radius: 3px;
549             color: #555; 1414                 color: #555;
550             line-height: 34px; 1415                 top: 0;
551             padding: 0; 1416                 &:checked:before {
    1417                   content: "\e8c5";
    1418                   font-family: 'porto-icons';
    1419                   font-weight: 900;
    1420                   margin: 0;
    1421                   width: 1.15rem;
    1422                   height: 1.2rem;
    1423                   line-height: 1.2rem;
    1424                   float: left;
    1425                   font-size: 11px;
552             text-align: center; 1426                   text-align: center;
553             width: 100%;    
554             border: 0;    
555         } 1427                 }
556         .subscribe-bottom {    
557             position: absolute;    
558             bottom: 30px;    
559                 
560             label {    
561                 font-size: 11px;    
562                 vertical-align: middle;    
563             } 1428             }
564         } 1429         }
565         #newsletter_popup_dont_show_again { 1430         div.mage-error[generated] {
566             margin-top1px; 1431           position: absolute;
567             vertical-align: middle; 1432           margin-top40px;
    1433           font-size: .87em;
568         } 1434         }
569     } 1435     }
570 } 1436 }
571  1437 
572 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) { 1438 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
573     .footer-bottom { 1439     .footer-bottom {
574         & > .container > * { 1440         & > .container > * {
575             float: none !important; 1441             float: none !important;
576             line-height: 35px !important; 1442             line-height: 35px !important;
577         } 1443         }
578     } 1444     }
579         
580     .history { 1445     .history {
581         .featured-box { 1446         .featured-box {
582             margin-right: 0; 1447             margin-right: 0;
583         } 1448         }
584         .thumb { 1449         .thumb {
585             display: none; 1450             display: none;
586         } 1451         }
587     } 1452     }
588 } 1453 }
    1454 @media (min-width: 768px) {
    1455   .onepage-category{
    1456     >.category-list{
    1457       >ul{
    1458         >li{
    1459           margin-bottom: 1rem;
    1460         }
    1461       }
    1462     }
    1463   }
    1464   .pt_row-o-full-height>.container>.row, .pt_row-o-equal-height>.container>.row>.pt_column_container>.pt_column-inner {
    1465     height: 100%;
    1466   }
    1467   .footer .footer-top .widget {
    1468       margin: 0;
    1469   }
    1470 }
    1471 @media(max-width:1199px){
    1472   .onepage-cat.category-list+.main.container{padding:0 50px;}
    1473   .onepage-category {
    1474     .category-detail {
    1475       .menu-popup ul>li> a{font-size:11px;}
    1476       .title-menu>.menu-popup{padding:10px 0;}
    1477       .title-menu>a{margin-top:46px;}
    1478     }
    1479   }
    1480 }
    1481 @media (max-width:991px) {
    1482   .footer .footer-bottom >.container {justify-content: flex-end;}
    1483   .footer .footer-bottom .custom-block.f-right {padding-right: 0;text-align: right;}
    1484   .porto-ibanner-layer {
    1485       font-size:.875rem
    1486   }
    1487 }
    1488 @media (min-width: 768px) and (max-width:991px) {
    1489   .onepage-category{
    1490     >.category-list{
    1491       .nav-open &{position:absolute;}
    1492     }
    1493   }
    1494 }
    1495 @media (max-width: 767px) {
    1496   .porto-ibanner-layer {
    1497       font-size:.8125rem
    1498   }
    1499   .cms-index-index .onepage-category,.onepage-category{display:block}
    1500   .onepage-category{
    1501     >.category-list{
    1502       width:auto;
    1503       float:none;
    1504       padding:0;
    1505       min-height:0;
    1506       position:static;
    1507       margin-bottom:20px;
    1508       >ul{
    1509         padding:0;
    1510         >li{
    1511           margin:0;
    1512           display:inline-block;
    1513           >a:after,>a:hover>span{display:none;}
    1514         }
    1515       }
    1516     }
    1517     >.category-details{
    1518       float:none;
    1519       width:auto;
    1520     }
    1521     >.category-list>ul{position:static!important;}
    1522     .category-detail {
    1523       .menu-popup {
    1524         >ul{
    1525           display:block;
    1526           &.columns5>li{
    1527             width:50%;
    1528             padding:10px 15px;
    1529             &:nth-child(5n+1){
    1530               border-right:1px solid #bebebe;
    1531               clear:none;
    1532             }
    1533             &:nth-child(2n+1){
    1534               border-right:0;
    1535               clear:right;
    1536             }
    1537           }
    1538         }
    1539         ul>li> a{font-size:14px;}
    1540       }
    1541     }
    1542   }
    1543 }
    1544 
    1545 @media (max-width: 575px) {
    1546     .porto-ibanner-layer {
    1547         font-size:.75rem
    1548     }
    1549     .onepage-category .category-detail .products-area .category-link{
    1550       margin-right:0;
    1551       margin-bottom: 25px;
    1552       float:none;
    1553       display:inline-block;
    1554     }
    1555 }